<%@ Page Language="C#" MasterPageFile="~/Main.master" AutoEventWireup="true" CodeFile="Prediction.aspx.cs"
    Inherits="Prediction" Title="" %>

<%@ Register Src="~/controls/misc/OfferEditor.ascx" TagPrefix="forecast" TagName="OfferEditor" %>
<%@ Register Src="~/controls/grids/ActiveOffers.ascx" TagPrefix="forecast" TagName="ActiveOffers" %>
<%@ Register Src="~/controls/grids/PredictionResults.ascx" TagPrefix="forecast" TagName="PredictionResults" %>
<%@ Register Src="~/controls/misc/TopNews.ascx" TagPrefix="forecast" TagName="TopNews" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <h1>
        <asp:Image ID="Image1" runat="server" ImageUrl="~/images/silk/sport_8ball.png" />
        <asp:Label runat="server" ID="_header" />
    </h1>      
    <hr />
    <asp:Label runat="server" ID="_subHead" />
    <div>
        <table width="100%" cellpadding="0" cellspacing="0">
            <tr>
                <td valign="top"><asp:Literal runat="server" ID="_longDescription" /></td>
                <td style="width:240px; vertical-align:top;padding-left:10px;">
                    <div id="offersChart" style="width: 230px; height:180px;"></div>
                    <script>
                        $(function() {
                            $('#offersChart').gchart({type: 'line',
                                backgroundColor: 'transparent',
                                chartColor: 'transparent',
                                axes: [$.gchart.axis('left', ['0', '50', '100'])],
                                markers: [$.gchart.marker('sparkfill', 'ccccff', 0)],
                                title: 'History', titleColor: 'black', titleSize: 14,
                                gridSize: [20, 50], gridLine: [5, 5], 
                                series: [$.gchart.series('Foo', [<%= GetOffers() %>], 'black')]
                            });
                        });
                    </script>
                </td>
            </tr>
        </table>
    </div>
    <br />
    <div>
        <table width="100%" cellpadding="0" cellspacing="0">
            <tr>
                <td><asp:Literal runat="server" ID="_status" /></td>
                <td style="width:135px;">
                    <div id="valueChart" style="width: 130px; height: 70px;">
                    </div>

                    <script>
                        $(function() {
                            $('#valueChart').gchart(
                                $.gchart.meter('<%= GetLastValue() %>', <%= GetLastValue() %>));
                        });
                    </script>

                </td>
            </tr>
        </table> 
    </div>
    <br />
    <br />
    <div>
        <table width="93%">
            <tr>
                <td align="right" id="_upperCreateNewOfferLink" runat="server" colspan="2">
                    <%= GetCreateNewOfferSentence()%>
                </td>
            </tr>
        </table>
    </div>
    <forecast:ActiveOffers runat="server" ID="_activeOffers" />
    <div>
        <table width="93%">
            <tr>
                <td align="right" id="_lowerCreateNewOfferLink" runat="server" colspan="2" style="padding-top: 7px">
                    <%= GetCreateNewOfferSentence()%>
                </td>
            </tr>
        </table>
    </div>
    <forecast:PredictionResults runat="server" ID="_predictionResults" />
    <forecast:TopNews runat="server" ID="_topNews" />
</asp:Content>
